<template>
  <div class="app-container">
    <el-card>
      <!-- 警告栏 -->
      <el-alert :title="`数据一共20条`"
                type="info"
                :closable="false"
                show-icon>
      </el-alert>
      <el-table style="width: 100%"
                :data="tableData">
        <el-table-column label="操作类型"
                         width="330"
                         prop="ms">
        </el-table-column>
        <el-table-column label="操作人"
                         width="330"
                         prop="name">
        </el-table-column>
        <el-table-column label="执行结果"
                         width="335"
                         prop="address">
        </el-table-column>
        <el-table-column label="操作时间"
                         width="332"
                         prop="time">
        </el-table-column>
        <el-table-column label="描述"
                         width="330"
                         prop="number">
        </el-table-column>
      </el-table>
      <br>
      <!-- 分页器 -->
      <el-pagination :current-page="query.pages"
                     :page-sizes="[ 10, 20, 30,50]"
                     :page-size="query.pageSize"
                     layout="prev, pager, next, sizes, jumper"
                     :total="query.counts"
                     class="listPagination"
                     background>
      </el-pagination>
    </el-card>

  </div>
</template>



<script>
export default {
  name: 'base-logs',
  data() {
    return {
      tableData: [
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄',
          number: '19999999999999999',
          ms: '12321312321',
          time: '3077-09-26 12:12:12'
        }
      ],
      query: {
        // 每页大小
        pageSize: 10,
        // 总数
        counts: 11,
        // 总页数
        pages: 2,
        // 当前页码
        page: 1
      }
    }
  }
}
</script>
<style lang="scss" scoped>
</style>
